
import introJs from 'intro.js'
/**
 * 随机生成数字
 *
 * 示例：生成长度为 12 的随机数：randomNumber(12)
 * 示例：生成 3~23 之间的随机数：randomNumber(3, 23)
 *
 * @param1 最小值 | 长度
 * @param2 最大值
 * @return int 生成后的数字
 */
export function randomNumber() {
  // 生成 最小值 到 最大值 区间的随机数
  const random = (min, max) => {
    return Math.floor(Math.random() * (max - min + 1) + min)
  }
  if (arguments.length === 1) {
    let [length] = arguments
    // 生成指定长度的随机数字，首位一定不是 0
    let nums = [...Array(length).keys()].map(i => (i > 0 ? random(0, 9) : random(1, 9)))
    return parseInt(nums.join(''))
  } else if (arguments.length >= 2) {
    let [min, max] = arguments
    return random(min, max)
  } else {
    return Number.NaN
  }
}

/**
 * 随机生成字符串
 * @param length 字符串的长度
 * @param chats 可选字符串区间（只会生成传入的字符串中的字符）
 * @return string 生成的字符串
 */
export function randomString(length, chats) {
  if (!length) length = 1
  if (!chats) chats = '0123456789qwertyuioplkjhgfdsazxcvbnm'
  let str = ''
  for (let i = 0; i < length; i++) {
    let num = randomNumber(0, chats.length - 1)
    str += chats[num]
  }
  return str
}

/**
 * 随机生成uuid
 * @return string 生成的uuid
 */
export function randomUUID() {
  let chats = '0123456789abcdef'
  return randomString(32, chats)
}
/**
 * 新手引导步骤
 * @param module 这个变量可以用来存取版本号， 系统更新时候改变相应值
 * @param cur_version 这个变量可以用来存取版本号， 系统更新时候改变相应值
 */
export function handleIntroJs(module, cur_version, callback) {
  //每个页面设置不同的缓存变量名称，不可以重复，有新版本时，更新cur_version
  //有新版本更新时才出现一次引导页， 第二次进入进不再出现， 这里有缓存来判断
  let introJsObj = introJs()
  if (module !== 'indexChart') {
    let idElement = '#' + module
    introJsObj = introJs()
  }
  if (localStorage.getItem('intro_cache_' + module) === cur_version) {
    return
  }
  console.log('introJsObj :>> ', introJsObj);
  introJsObj
    .setOptions({
      prevLabel: '&larr; 上一步',
      nextLabel: '下一步' ,
      doneLabel: '知道了',
      exitOnOverlayClick: false, //点击空白区域是否关闭提示组件
      steps: [
        { title: '系统使用指导', element: '#ppt-des-1', intro: '导入PPT模板文件' },
        { title: '选择动态模板', element: '#ppt-des-2', intro: '动态模板会关联商品数据，静态模板则不会' },
        { title: '选中b标题文本', element: '#ppt-des-3', intro: '选中需要关联商品信息的文本', },
        { title: '绑定数据', element: '#ppt-des-4', intro: '选中键值，绑定对应的数据并设置标题', },
        { title: '保存到模板', element: '#ppt-des-5', intro: '保存到模板后，到 报价单 > 下载ppt > 选中模板 > 下载', },
      ]

    })
    .onAfterChange((obj)=>{
      callback(obj)
    })
    .oncomplete(function () {
      //点击跳过按钮后执行的事件(这里保存对应的版本号到缓存,并且设置有效期为100天）
      localStorage.setItem('intro_cache_' + module, cur_version, 100 * 24 * 60 * 60 * 1000)
    })
    .onexit(function () {
      //点击结束按钮后， 执行的事件
      localStorage.setItem('intro_cache_' + module, cur_version, 100 * 24 * 60 * 60 * 1000)
    })
    .start()
}
